import React, { Component } from 'react'
import { connect } from 'react-redux'
import QaList from './qaList'
import { QuestionAction } from '@act'

class QaContent extends Component {
  clickEnterQuestion = () => {
    const { dispatch } = this.props
    dispatch(QuestionAction.toggleShow(true))
  }
  renderQuestionListEntry() {
    const { realList } = this.props
    return realList.length > 0 ? (
      <div onClick={this.clickEnterQuestion} className="replay_qa_question_entry">
        <img className="question_list_entry_icon" src={require('@images/question/new_qa_list_entry_icon.png')} alt=""/>
      </div>
    ) : null
  }
  render() {

    return (
      <div className="qa_content">
        <QaList />
        { this.renderQuestionListEntry() }

      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    realList: state.QuestionState.realList
  }
}

export default connect(mapStateToProps)(QaContent)
